<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
//			浏览器在加载一个页面时,是按照自上向下的顺序加载的
//			读取一行就加载一行
//			在代码执行时,页面还没有加载,页面没有加载DOM对象也没有加载
//			会导致无法获取到DOM对象
			
			
//			onload事件会在整个页面加载完成之后才触发
//			为window绑定一个onload事件
//				该事件对应响应函数将会在页面加载完成之后执行
//				这样可以确保我们的代码执行时所有的DOM对象已经加载完成了,
//				这样就不会出现获取不到DOM对象的情况(null)
				
			window.onload = function(){
				//获取id为btn的按钮
				var btn = document.getElementById("btn")
 				console.log(btn);
				//为按钮绑定一个单击响应函数
				btn.onclick = function(){
					alert("hello")
				}
				
	//			alert("hello");
			}
		</script>
	</head>
	<body>
		<button id="btn">按钮</button>
		
		<!--<script type="text/javascript">
			//将js代码编写到页面的下面就是为了，可以在页面加载完毕以后在执行js代码
		
			//获取id为btn的按钮
			var btn = document.getElementById("btn")
			
			console.log(btn);
			//为按钮绑定一个单击响应函数
			btn.onclick = function(){
				alert("hello")
			}
		</script>-->
		
	</body>
</html>
